<template>
	<div class="layout-padding">
		<div class="layout-padding-auto layout-padding-view">
			<div class="topDom">
				<div class="dialogDom">
					<div><span>创作者昵称:</span>{{ summaryDetailData.nikeName }}</div>

					<div><span>手机号:</span>{{ summaryDetailData.mobile }}</div>

					<div><span>创作者等级:0</span></div>

					<div><span>常登陆IP:</span>{{ summaryDetailData.curIp }}</div>
				</div>
				<div class="dialogDom">
					<div><span>创造者类型:</span>{{ summaryDetailData.authorType }}</div>
					<div><span>创作者ID:</span>{{ summaryDetailData.userId }}</div>
					<div><span>是否实名认证:</span>{{ summaryDetailData.realStatus == 0 ? '未认证' : '已认证' }}</div>
					<div><span>发布内容总数:</span>{{ summaryDetailData.publishCount }}</div>
				</div>
				<div class="dialogDom">
					<div><span>自动监控次数:</span>{{ summaryDetailData.auditCount }}</div>
					<div><span>被举报次数:</span>{{ summaryDetailData.reportCount }}</div>
				</div>
			</div>
			<div>
				<el-tabs v-model="activeName" type="card" class="demo-tabs" @tab-click="handleClick">
					<el-tab-pane label="文章作品" name="article">
						<el-table v-loading="loading" :data="list" style="width: 100%" border
							:header-cell-style="{ background: '#f5f7fa!important', color: '#000' }">
							<el-table-column label="序号" type="index" align="center" width="80"> </el-table-column>
							<el-table-column label="文章ID" align="center" prop="id" width="180" />
							<el-table-column label="文章标题" align="center" prop="title" width="280" />
							<el-table-column label="链接" align="center" prop="originalUrl" width="370" />

							<el-table-column label="发布地址" align="center" prop="publishAddress" width="180" />

							<el-table-column label="文章类型" align="center" prop="categoryidDesc" width="120" />
							<el-table-column label="举报数" align="center" prop="reportCount" width="100">
								<template #default="scope">
									{{ scope.row.reportCount == null ? '0' : scope.row.reportCount }}
								</template>
							</el-table-column>
							<el-table-column label="收藏数" align="center" prop="collectCount" width="100">
								<template #default="scope">
									{{ scope.row.collectCount == null ? '0' : scope.row.collectCount }}
								</template>
							</el-table-column>

							<el-table-column label="评论数" align="center" prop="commentCount" width="100">
								<template #default="scope">
									{{ scope.row.commentCount == null ? '0' : scope.row.commentCount }}
								</template>
							</el-table-column>
							<el-table-column label="点赞数" align="center" prop="likeCount" width="100">
								<template #default="scope">
									{{ scope.row.likeCount == null ? '0' : scope.row.likeCount }}
								</template>
							</el-table-column>
							<el-table-column label="转发数" align="center" prop="forwardCount" width="100">
								<template #default="scope">
									{{ scope.row.forwardCount == null ? '0' : scope.row.forwardCount }}
								</template>
							</el-table-column>

							<el-table-column label="分享数" align="center" prop="shareCount" width="100">
								<template #default="scope">
									{{ scope.row.shareCount == null ? '0' : scope.row.shareCount }}
								</template>
							</el-table-column>
							<el-table-column label="发布状态" align="center" prop="publishStatusDesc" width="120" />
							<el-table-column label="审核状态" align="center" prop="auditStatusDesc" width="120" />
							<!-- <el-table-column label="监控类型" align="center" prop="" width="120" />
				<el-table-column label="违规等级" align="center" prop="" width="120" /> -->
							<el-table-column label="发布时间" align="center" prop="publishTime" width="120"> </el-table-column>
							<el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="120">
								<template #default="scope">
									<el-button link icon="" @click="details(scope.row)" type="primary"> 查看详情 </el-button>
								</template>
							</el-table-column>
						</el-table>
					</el-tab-pane>
					<el-tab-pane label="视频作品" name="videoWorks">
						<el-table v-loading="loading" :data="list" style="width: 100%" border
							:header-cell-style="{ background: '#f5f7fa!important', color: '#000' }">
							<el-table-column label="序号" type="index" align="center" width="80"> </el-table-column>
							<el-table-column label="视频ID" align="center" prop="id" width="180" />
							<el-table-column label="视频标题" align="center" prop="title" width="280" />
							<el-table-column label="链接" align="center" prop="originalUrl" width="370" />

							<el-table-column label="发布地址" align="center" prop="publishAddress" width="180" />

							<el-table-column label="视频类型" align="center" prop="category" width="120" />
							<el-table-column label="举报数" align="center" prop="reportCount" width="100">
								<template #default="scope">
									{{ scope.row.reportCount == null ? '0' : scope.row.reportCount }}
								</template>
							</el-table-column>
							<el-table-column label="收藏数" align="center" prop="collectCount" width="100">
								<template #default="scope">
									{{ scope.row.collectCount == null ? '0' : scope.row.collectCount }}
								</template>
							</el-table-column>

							<el-table-column label="评论数" align="center" prop="commentCount" width="100">
								<template #default="scope">
									{{ scope.row.commentCount == null ? '0' : scope.row.commentCount }}
								</template>
							</el-table-column>
							<el-table-column label="点赞数" align="center" prop="likeCount" width="100">
								<template #default="scope">
									{{ scope.row.likeCount == null ? '0' : scope.row.likeCount }}
								</template>
							</el-table-column>
							<el-table-column label="转发数" align="center" prop="forwardCount" width="100">
								<template #default="scope">
									{{ scope.row.forwardCount == null ? '0' : scope.row.forwardCount }}
								</template>
							</el-table-column>

							<el-table-column label="分享数" align="center" prop="shareCount" width="100">
								<template #default="scope">
									{{ scope.row.shareCount == null ? '0' : scope.row.shareCount }}
								</template>
							</el-table-column>
							<el-table-column label="发布状态" align="center" prop="publishStatusDesc" width="120" />
							<el-table-column label="审核状态" align="center" prop="auditStatusDesc" width="120" />
							<!-- <el-table-column label="监控类型" align="center" prop="" width="120" />
				<el-table-column label="违规等级" align="center" prop="" width="120" /> -->
							<el-table-column label="发布时间" align="center" prop="publishTime" width="120"> </el-table-column>
							<el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="120">
								<template #default="scope">
									<el-button link icon="" @click="details(scope.row)" type="primary"> 查看详情 </el-button>
								</template>
							</el-table-column>
						</el-table>
					</el-tab-pane>
				</el-tabs>
			</div>
		</div>

		<el-pagination class="paginationdDom" background @size-change="handleSizeChange"
			@current-change="handleCurrentChange" :current-page="queryParams.current" :page-size="queryParams.size"
			:layout="layout" :total="total">
		</el-pagination>
	</div>
</template>

<script>
import { getUserAuditSummaryDetail } from '/@/api/admin/monitor';
import { videoPage, articlePage } from '/@/api/admin/content';
export default {
	name: 'Online',
	data() {
		return {
			activeName: 'article',
			layout: 'total, sizes, prev, pager, next, jumper',
			outerVisible: false,
			summaryDetailData: {},
			// 遮罩层
			loading: true,
			// 总条数
			total: 0,
			// 表格数据
			list: [],
			pageNum: 1,
			pageSize: 10,
			// 查询参数
			queryParams: {
				current: 1,
				size: 10,
			},
		};
	},
	created() {
		this.articlePage();
	},
	mounted() {},
	methods: {
		handleClick(tab, event) {
			if (this.activeName == 'article') {
				this.articlePage();
			}
			if (this.activeName == 'videoWorks') {
				this.videoPage();
			}
		},
		/** 查询登录日志列表 */
		articlePage() {
			this.loading = true;
			this.queryParams.userId = this.$route.query.userId;
			this.queryParams.needBizCountFlag=true
			articlePage(this.queryParams).then((res) => {
				this.list = res.data.records;
				this.total = res.data.total;
				this.loading = false;
				this.getUserAuditSummaryDetail();
			});
		},
		videoPage() {
			this.loading = true;
			this.queryParams.userId = this.$route.query.userId;
			this.queryParams.needBizCountFlag=true
			videoPage(this.queryParams).then((res) => {
				this.list = res.data.records;
				this.total = res.data.total;
				this.loading = false;
				this.getUserAuditSummaryDetail();
			});
		},
		getUserAuditSummaryDetail() {
			let data = {
				id: this.$route.query.userId,
			};
			getUserAuditSummaryDetail(data).then((res) => {
				this.summaryDetailData = res.data;
			});
		},
		/** 搜索按钮操作 */
		handleQuery() {
			this.pageNum = 1;
			// this.getList();
		},
		/** 重置按钮操作 */
		resetQuery() {
			this.resetForm('queryForm');
			this.handleQuery();
		},
		details(row) {
			console.log(row);
			this.$router.push({ path: '/monitor/content/details', query: { bizId: row.contentId, dataType: row.dataType } });
		},
		handleSizeChange(val) {
			this.queryParams.size = val;
			this.queryParams.current = 1; //调整每页数目时，重置当前页，避免当前显示在不存在的页数
			this.getAuthorWorksPage(); //调接口，更新数据
		},
		// 更改当前页
		handleCurrentChange(val) {
			this.queryParams.current = val;
			this.getAuthorWorksPage(); //调接口，更新数据
		},
	},
};
</script>
<style lang="scss" scoped>
.topDom {
	border-bottom: 1px solid #e3e3e3;
	padding: 1%;
	margin-bottom: 20px;
}

.dialogDom {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	text-align: left;
	color: #666;
	font-size: 16px;
	background-color: #fff;
	color: #999;

	>div {
		width: 23%;
		margin-right: 2%;
		margin-bottom: 1%;

		span {
			color: #000;
			margin-right: 5px;
		}
	}
}

.dialogDiv {
	margin-bottom: 2%;
}
</style>
